<template>
    <div :class="[flag ? 'version-list-flag' : '']" ref="versionItemRef" style="border: 1px solid transparent">
        <!-- 有子产品，统一发版的-->
        <HCollapse v-model:expanded="expanded" collapse @change="handleLoadData">
            <template #title>
                <span style="color: #70798b">
                    {{ systemDetail.pmpProductDetailDTO.systemName }}
                </span>
            </template>
            <div style="padding-left: 4px">
                <CommonTaskRequireList
                    :list="systemDetail.pmpRequestInfos"
                    :disabled="disabled"
                    :versionDetail="systemDetail"
                    @success="handleLoadData"
                />
                <CommonProRequireList
                    :list="systemDetail.pmpProductRequires"
                    :disabled="disabled"
                    :versionDetail="systemDetail"
                    @success="handleLoadData"
                />
            </div>
        </HCollapse>
    </div>
</template>

<script lang="ts">
import store from '@/store';
import api from '@/api';
import CommonProRequireList from '../components/CommonProRequireList.vue';
import CommonTaskRequireList from '../components/CommonTaskRequireList.vue';
import HCollapse from '../components/HCollapse.vue';
import { message } from 'ant-design-vue';
import { useDrop } from '@/hooks/content/useDrop';
import { defineComponent, onMounted, ref, unref, reactive, toRefs, getCurrentInstance } from 'vue';
export default defineComponent({
    components: {
        HCollapse,
        CommonProRequireList,
        CommonTaskRequireList
    },
    props: {
        detail: {
            type: Object,
            default: () => ({})
        },
        lubiaoDetail: {
            type: Object,
            default: () => ({})
        },
        defaultOpen: {
            type: Boolean,
            default: false
        },
        systemDetail: {
            type: Object,
            default: () => ({})
        },
        signPostShowType: {
            type: String,
            default: ''
        },
        disabled: {
            type: Boolean,
            default: false
        }
    },
    emits: ['change', 'success'],
    setup(props, { emit }) {
        const instance: any = getCurrentInstance();
        const versionItemRef = ref<any>(null);
        const state = reactive<any>({
            lastenter: null,
            flag: false,
            expanded: false,
            subVersionSystemList: []
        });
        const handleLoadData = async (expanded) => {
            if (expanded) {
                emit('success', true);
            }
        };

        // 绑定业务需求
        const handleUpdateTaskBatch = async (item) => {
            const query = {
                businessId: item.id,
                versionId: props.systemDetail.id,
                type: 'add'
            };
            const { success, errorMsg } = await api.pmpRequestInfoModel.signpostBVSave(query);
            if (success) {
                const { type } = store.getters.moveData;
                if (type === 1) {
                    // 刷新业务需求列表
                    instance.proxy.$mitt.emit('taskRequireList-subversionSystemItem-refreshTaskList', {}, true);
                } else {
                    // 刷新业务需求列表
                    instance.proxy.$mitt.emit('unVersionTaskRequireList-subversionSystemItem-refreshTaskList', {}, true);
                }
                emit('success', true);
            } else {
                message.error(errorMsg);
            }
        };
        // 绑定产品需求
        const handleUpdateProBatch = async (item) => {
            const { empId, name } = store.getters.userInfo.employeeDTO;
            const query = [
                {
                    productRequireId: item.id,
                    relateVersionId: props.systemDetail.id,
                    relateVersionName: props.systemDetail.versionName,
                    relateVersionNumber: props.systemDetail.versionNumber,
                    status: 'add',
                    empId,
                    empName: name
                }
            ];
            const { success, errorMsg } = await api.productRequireModel.batchDeal(query);
            if (success) {
                emit('success', true);
                // 刷新产品需求列表
                instance.proxy.$mitt.emit('unVersionProRequireList-subversionSystemItem-refreshProList', {}, true);
            } else {
                message.error(errorMsg);
            }
        };

        const handleShow = (ev: Event) => {
            ev.preventDefault();
            state.lastenter = ev.target;
            state.expanded = true;
            state.flag = true;
        };
        const handleHide = (ev: Event) => {
            if (state.lastenter === ev.target) {
                state.flag = false;
                ev.stopPropagation();
                ev.preventDefault();
            }
        };
        const onDrop = () => {
            state.flag = false;
            const { type } = store.getters.moveData;
            switch (type) {
                case 1:
                case 2:
                    handleUpdateTaskBatch(store.getters.moveData);
                    break;
                case 3:
                    handleUpdateProBatch(store.getters.moveData);
                    break;
            }
        };

        onMounted(() => {
            useDrop(unref(versionItemRef), {
                onShow: handleShow,
                onHide: handleHide,
                onDrop
            });
        });

        return {
            ...toRefs(state),
            versionItemRef,
            handleLoadData
        };
    }
});
</script>
<style scoped lang="less">
.version-list-flag {
    border: 1px dashed @primary-color!important;
}
::v-deep(.ant-collapse-content > .ant-collapse-content-box) {
    padding-bottom: 8px;
}
</style>